﻿@{
    ViewBag.Title = "Booking Calendar";
}
@{
    Layout = null;
}
@using System.Web.Script.Serialization
<!DOCTYPE html>
<html>

<head>
    <title>@ViewBag.Title</title>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">

    <link href="@Url.Content("../Content/cal.css")" rel="stylesheet" type="text/css" />
    <script src="../scripts/jquery-1.9.1.js"></script>
    <script src="../scripts/ui/jquery-ui.js"></script>

    
    <script src="../Scripts/jquery.unobtrusive-ajax.min.js" type="text/javascript"></script>
 

    <style>
        #main {
            height: 510px;
        }

      .green_section {
            background-color: #000000 ;
            opacity: 0.25;
      } 
    

   @foreach (var userColor in Model.cls)
   {
       <text>
       .dhx_cal_event.user_@(userColor.ID) div,
       .dhx_cal_event_line.user_@(userColor.ID),
       .dhx_cal_event_clear.user_@(userColor.ID),
	   .dhx_wa_ev_body.user_@(userColor.ID)
       {
           background-color: @(userColor.COLOR1) !important;
         color:red;
        font-weight:bold;
       }
       </text>
   }
   @foreach (var userColor in Model.cls)
   {
       <text>
       .dhx_cal_event.un_user_@(userColor.ID) div,
       .dhx_cal_event_line.un_user_@(userColor.ID),
       .dhx_cal_event_clear.un_user_@(userColor.ID),
	   .dhx_wa_ev_body.un_user_@(userColor.ID)
       {
           background-color: @(userColor.COLOR1) !important;
           color:green;
        font-weight:bold;
       }
       </text>
   }
   .dhx_cal_event.old_event div,
   .dhx_cal_event_line.old_event,
   .dhx_cal_event_clear.old_event,
   .dhx_wa_ev_body.old_event
   {
        background-color: #B9B9B9 !important;
   }

    @if(Model.CurrentID != null){
        <text>
        .active_user{
            color:@Model.Colors[Model.CurrentID];
        }
        </text>
    }


    </style>
    <script>
           $(document).ready(function () {
               $("#name").autocomplete({
                   source: function(request,response) {
                       $.ajax({
                           url: "/BasicScheduler/AutocompleteSuggestions",
                           type: "POST",
                           dataType: "json",
                           data: { term: request.term },
                           success: function (data) {
                               response($.map(data, function (item) {
                              
                                   return { label: item.englishName, value: item.englishName , aname: item.arabicName, patID : item.ID, recordNumber : item.recordNumber};
                               }))

                           }
                           
                       })
                   },
                
                   messages: {
                       noResults: "", results: ""
                   },
                   select: function(event, ui) {
                       $("#aname").val(ui.item.aname);
                       $("#patID").val(ui.item.patID);
                     
               }
               });
       
           })

           function sub()
           {
               $("#searchForm").submit();
           }
    // Popup window code
    function newPopup(url) {
        popupWindow = window.open(
            url, 'popUpWindow', 'height=700,width=800,left=10,top=10,resizable=yes,scrollbars=yes,toolbar=yes,menubar=no,location=no,directories=no,status=yes')
    }
    function updateValue(arabic,v, recordID)
    {
        // this gets called from the popup window and updates the field with a new value
        document.getElementById("name").value = v;
        document.getElementById("aname").value = arabic;
        document.getElementById("patID").value = recordID;
    }
    function attachRules() {
    

            var rooms = @Html.Raw(new JavaScriptSerializer().Serialize(Model.Rooms));
            //Add a helper that we’ll need later:
            //returns room name by id
            function getRoom(id) {
                for (var i in rooms) {
                    if (rooms[i].key == id)
                        return rooms[i].label;
                }
                return "";
            }


            var needLoginMessage = "You need to login first";

            var pastEventMessage = "You can't add or edit events in the past";
            var othersEventMessage = "You can't edit other's event;"


            var isEditable = function(event_id){
                if(!checkLoggedIn())
                    return false;
                var event_obj = scheduler.getEvent(event_id);
                if(!checkEventOwner(event_obj ))
                    return false;
                if(!event_obj)
                    return false;
                return checkValidDate(event_obj.start_date);
            };


            function checkEventOwner(event){
                if(event.user_id && event.user_id != "@Model.CurrentID"){
                    dhtmlx.message(othersEventMessage);
                    return false;
                }
                return true;
            }

            function checkValidDate(date){
                if(date.valueOf() < new Date().valueOf()){
                    dhtmlx.message(pastEventMessage);
                    return false;
                }else{
                    return true;
                }
            }
            function checkValidDate(date){
                if(date.valueOf() < new Date().valueOf()){
                    dhtmlx.message(pastEventMessage);
                    return false;
                }else{
                    return true;
                }
            }

            function checkLoggedIn(){
                return true;
                @if(!this.Request.IsAuthenticated){
			<text>
                dhtmlx.message(needLoginMessage);
                return false;
                </text>
		}else{
			<text>
                return true;
                </text>
		}
            }

        $(document).ready(function () {
            scheduler.attachEvent("onAfterLightbox", function () {
                   scheduler.clearAll();
                scheduler.load('/BasicScheduler/Data','json');
                scheduler.updateView();
            });
           

        });
            scheduler.attachEvent("onBeforeEventChanged", function(event){
                return true;
            });
            scheduler.attachEvent("onBeforeDrag", function (event_id, mode, native_event_object){
                if(event_id)
                    return isEditable(event_id);
                checkLoggedIn();
                var date = scheduler.getActionData(native_event_object).date;
                return checkValidDate(date);
            });

            scheduler.attachEvent("onEmptyClick", function (date){
                checkLoggedIn();
                checkValidDate(date);
            });


            scheduler.config.limit_start = new Date();
            setInterval(function(){
                scheduler.config.limit_start = new Date();
            }, 1000*60);


            @if(this.Request.IsAuthenticated){
		<text>
            //just for a demo purposes
            scheduler.attachEvent("onLimitViolation", function(){
                dhtmlx.message(pastEventMessage);
            });
            </text>
	}

        
            scheduler.templates.event_class = function(start, end, event){
                var className = "";
                if (event.confirmed == 1) 
                    return "un_user_" + event.color;
               else                
                className = "user_" + event.color;
                
                return className;
            };



            scheduler.templates.event_text = scheduler.templates.agenda_text = scheduler.templates.event_bar_text = function(start,end,ev){
                return getRoom(ev.roomID)+' : ' + ev.text;
            }
            scheduler.templates.week_agenda_event_text = function(start,end,ev){
                return scheduler.templates.event_date(ev.start_date) + ' ' +getRoom(ev.roomID)+' : ' + ev.text;
            }

        }


    </script>

</head>
<body>
    <div style="width: 100%; height: 100%; padding-top: 50px; padding-right: 50px; float:right">
        <div style="width: 15%; height: 250px; float: right; ">


            @{
                String patID = ""; String name = ""; String aname = "";
                if (ViewBag.name != null) { name = ViewBag.name; }
                if (ViewBag.aname != null) { aname = ViewBag.aname; }
                if (ViewBag.patID != null) { patID = ViewBag.patID; }  }

            <div style="width:100%;height:100%;float:left" id="container_id"></div>

            <br />
            <br />
            <div id="searchform" dir="rtl" style="width: 100%; height: 250px; float: right background-color: #ffffff;">
                @using (Html.BeginForm(null, null, FormMethod.Post, new { id = "searchForm" }))
                {
                      
                         
                                                                                        
                                                                                        
                                                                                     
                        
                    <fieldset>

                        <div>
                            <table>

                                <tr>

                                    <td>المعالج</td>
                                    <td>@Html.DropDownList("doctors")</td>

                                </tr>

                                <tr>

                                    <td> القسم</td>
                                    <td>@Html.DropDownList("sp")</td>

                                </tr>
                                <tr>

                                    <td>  المريض</td>
                                    <td><input type="text" value="@name" id="name" name="name" /></td>

                                </tr>
                                <tr>

                                    <td>  المريض</td>
                                    <td><input type="text" value="@aname" id="aname" name="aname" /></td>

                                </tr>
                                <tr>

                                    <td></td>
                                    <td><input type="hidden" value="@patID" id="patID" name="patID" /></td>

                                </tr>

                            </table>
                            
                          
                            <br />
                           
                          
                            <br />
                            

                          
                            <br />

                 

                            <br />
                          

                            <input type="submit" value="ارسل" />
                        </div>
                    </fieldset>
                }

            </div>


        </div>
        <div id=" calendar" style="width:80%;height:800px;float:right">
            @Html.Raw(Model.Scheduler.Render())
        </div>

    </div>
</body>
</html>
